<template>
  <el-dialog title="填写接待记录" :visible.sync="dialogFormVisible">
    <el-form ref="createreception" :model="creator" label-width="100px">
      <el-divider content-position="center">咨询人信息</el-divider>
      <el-row>
        <el-col :span="12">
          <el-form-item label="姓名"
                        :rules="[
      { required: true, message: '请输入咨询人姓名', trigger: 'blur' },
    ]">
            <el-input v-model="creator.consultantName"></el-input>
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item label="联系电话" :rules="[
      { required: true, message: '请输入咨询人联系电话', trigger: 'blur' },
    ]">
            <el-input v-model="creator.consultantContactNumber"></el-input>
          </el-form-item>
        </el-col>

      </el-row>
      <el-row>
        <el-col :span="12">
          <el-form-item label="与老人关系" :rules="[
      { required: true, message: '请输入咨询人与老人关系', trigger: 'blur' },
    ]">
            <el-select v-model="creator.consultantRelationship" placeholder="请选择与老人关系">
              <el-option v-for="item in readyData.relationship" :label="item.name" :value="item.dcNo" :key="item.dcNo"></el-option>
            </el-select>
          </el-form-item>
        </el-col>
        <el-col :span="12">

        </el-col>

      </el-row>
      <el-divider content-position="center">老人信息</el-divider>
      <el-row>
        <el-col :span="12">
          <el-form-item label="姓名" :rules="[
      { required: true, message: '请输入老人姓名', trigger: 'blur' },
    ]">
            <el-input v-model="creator.elderlyName"></el-input>
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item label="性别" :rules="[
      { required: true, message: '请选择老人性别', trigger: 'blur' },
    ]">
            <el-select v-model="creator.elderlyGender" placeholder="请选择老人性别">
              <el-option label="男" value="1"></el-option>
              <el-option label="女" value="0"></el-option>
            </el-select>
          </el-form-item>
        </el-col>

      </el-row>
      <el-row>
        <el-col :span="12">
<!--          <el-form-item label="出生日期" :rules="[-->
<!--      { required: true, message: '请输入老人出生日期', trigger: 'blur' },-->
<!--    ]">-->
<!--            <el-date-picker-->
<!--              style="width: 100%"-->
<!--              v-model="creator.elderlyBirth"-->
<!--              type="date"-->
<!--              placeholder="选择日期">-->
<!--            </el-date-picker>-->
<!--          </el-form-item>-->
          <el-form-item label="年龄" :rules="[
      { required: true, message: '请输入老人年龄', trigger: 'blur' },

    ]">
            <el-input v-model="creator.elderlyAge" type="number" min="1" max="200"></el-input>
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item label="自理情况" :rules="[
      { required: true, message: '请选择老人自理情况', trigger: 'blur' },
    ]">
            <el-select v-model="creator.elderlySelfCare" placeholder="请选择老人自理情况">
              <el-option v-for="item in readyData.selfCare" :label="item.name" :value="item.dcNo" :key="item.dcNo"></el-option>
            </el-select>
          </el-form-item>
        </el-col>

      </el-row>
      <el-row>
        <el-col :span="24">
          <el-form-item label="住址">
            <el-input v-model="creator.elderlyAddress"></el-input>
          </el-form-item>
        </el-col>

      </el-row>
      <el-divider content-position="center">其他信息</el-divider>
      <el-row>
        <el-col :span="12">
          <el-form-item label="咨询方式" :rules="[
      { required: true, message: '请选择咨询方式', trigger: 'blur' },
    ]">
            <el-select v-model="creator.consultationMode" placeholder="请选择咨询方式">
              <el-option v-for="item in readyData.consultationMode" :label="item.name" :value="item.dcNo" :key="item.dcNo"></el-option>
            </el-select>
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item label="接待状态" :rules="[
      { required: true, message: '请选择接待状态', trigger: 'blur' },
    ]">
            <el-select v-model="creator.receptionStatus" placeholder="请选择接待状态">
              <el-option label="咨询" value="1"></el-option>
              <el-option label="跟进中" value="2"></el-option>
              <el-option label="已签约" value="3"></el-option>
              <el-option label="关闭" value="0"></el-option>
            </el-select>
          </el-form-item>
        </el-col>

      </el-row>
      <el-row>
        <el-col :span="12">
          <el-form-item label="媒介渠道" :rules="[
      { required: true, message: '请选择媒介渠道', trigger: 'blur' },
    ]">
            <el-select v-model="creator.mediaChannel" placeholder="请选择媒介渠道">
              <el-option v-for="item in readyData.mediaChannel" :label="item.name" :value="item.dcNo" :key="item.dcNo"></el-option>
            </el-select>
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item
            label="咨询次数"
            prop="numberOfConsultations"
            :rules="[
      { required: true, message: '咨询次数不能为空'},
      { type: 'number', message: '咨询次数必须为数字值'}
    ]"
          >
            <el-input type="numberOfConsultations" v-model.number="creator.numberOfConsultations" autocomplete="off"></el-input>
          </el-form-item>
        </el-col>
      </el-row>
      <el-row>
        <el-col :span="12">
          <el-form-item label="接待人" :rules="[
      { required: true, message: '请选择接待人', trigger: 'blur' },
    ]">
            <el-select v-model="creator.receptionist" placeholder="请选择接待人">
              <el-option v-for="item in readyData.receptionist" :label="item.userName" :value="item.uname" :key="item.uname"></el-option>
            </el-select>
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item label="咨询意向" :rules="[
      { required: true, message: '请选择咨询意向', trigger: 'blur' },
    ]">
            <el-select v-model="creator.consultationIntention" placeholder="请选择咨询意向">
              <el-option v-for="item in readyData.consultationIntention" :label="item.name" :value="item.dcNo" :key="item.dcNo"></el-option>
            </el-select>
          </el-form-item>
        </el-col>
      </el-row>
      <el-row>
        <el-col :span="12">
          <el-form-item label="咨询时间" :rules="[
      { required: true, message: '请输入咨询时间', trigger: 'blur' },
    ]">
            <el-date-picker
              v-model="creator.consultationTime"
              type="datetime"
              placeholder="选择日期时间">
            </el-date-picker>
          </el-form-item>
        </el-col>
        <el-col :span="12">

        </el-col>
      </el-row>
      <el-row>
        <el-col :span="24">
          <el-form-item label="咨询内容">
<!--            <el-input type="textarea" v-model="creator.consultationContent"></el-input>-->
            <el-autocomplete
              type="textarea"
              style="width: 100%"
              class="inline-input"
              v-model="creator.consultationContent"
              :fetch-suggestions="querySearch"
              placeholder="请输入咨询内容"
              @select="handleSelect"
            ></el-autocomplete>
          </el-form-item>
        </el-col>

      </el-row>
    </el-form>
    <div slot="footer" class="dialog-footer">
      <el-button @click="dialogFormVisible = false">取 消</el-button>
      <el-button type="primary" @click="save">确 定</el-button>
    </div>
  </el-dialog>
</template>

<script>
    import { searchLabels } from "@/api/mechanism"
    import { saveReceptions } from "@/api/reception";
    import {searchUserOfOrgan} from "@/api/user"
    import {findAllDictionaryWithChild} from "@/api/dict"
    import { parseTime} from "@/utils/index";
    export default {
        name: "",
        filters:{
                  parseTime:parseTime
                },
        data() {
            return {
                restaurants: [

                ],
              dialogFormVisible: false,
              creator: {
                "consultantContactNumber": "",
                "consultantName": "",
                "consultantRelationship": 1,
                "consultationContent": "",
                "consultationIntention": 1,
                "consultationMode": 1,
                "consultationTime": new Date(),
                "elderlyAddress": "",
                "elderlyBirth": "",
                "elderlyGender": '1',
                "elderlyName": "",
                "elderlySelfCare": 1,
                  "elderlyAge":"",
                "mediaChannel": 4,
                "numberOfConsultations": '',
                "receptionStatus": '1',
                "receptionist": 'admin'
              },
              //准备阶段数据
              readyData: {
                consultationIntention: [],
                consultationMode: [],
                mediaChannel: [],
                relationship: [],
                selfCare: [],
                receptionist: []
              }
            }
        },
        methods: {
          show() {
              this.creator={
                  "consultantContactNumber": "",
                  "consultantName": "",
                  "consultantRelationship": 1,
                  "consultationContent": "",
                  "consultationIntention": 1,
                  "consultationMode": 1,
                  "consultationTime": new Date(),
                  "elderlyAddress": "",
                  "elderlyBirth": "",
                  "elderlyGender": '1',
                  "elderlyName": "",
                  "elderlySelfCare": 1,
                  "elderlyAge":"",
                  "mediaChannel": 4,
                  "numberOfConsultations": '',
                  "receptionStatus": '1',
                  "receptionist": ''
              }
              this.creator.receptionist=localStorage.getItem("username")

              this.dialogFormVisible = true
          },
          save() {

            this.$refs["createreception"].validate(async (valid) => {
              if (valid) {
                const data = await saveReceptions(this.creator);
                if(data.code == "200") {
                  this.$baseMessage("添加成功");
                  this.dialogFormVisible = false
                    this.$parent.search()
                } else {
                  this.$baseMessage("添加失败，"+data.message);
                }
              } else {
                return false;
              }
            });

          },
          searchReceptionists(){
            searchUserOfOrgan().then(result => {
              if(result.code == "200"){
                this.readyData.receptionist = result.data
                  console.log(this.readyData.receptionist)

              }
            })
          },
          searchDictInfo(){
            findAllDictionaryWithChild().then(result => {
              if(result.code == "200"){
                if(result.data!=null){
                  for(let index in result.data){
                    let item = result.data[index]
                    if(item.mark == 'consultationIntention'){
                      this.readyData.consultationIntention = item.childs
                    }else if(item.mark == 'consultationMode'){
                      this.readyData.consultationMode = item.childs
                    }else if(item.mark == 'mediaChannel'){
                      this.readyData.mediaChannel = item.childs
                    }else if(item.mark == 'relationship'){
                      this.readyData.relationship = item.childs
                    }else if(item.mark == 'selfCare'){
                      this.readyData.selfCare = item.childs
                    }
                  }
                }
              }
            })
          },

            createFilter(queryString) {

                return (restaurant) => {
                    console.log(restaurant)

                    return (restaurant.value.toLowerCase().indexOf(queryString.toLowerCase()) === 0);
                };
            },

            querySearch(queryString, cb) {

                var restaurants = this.restaurants;
                var results = queryString ? restaurants.filter(this.createFilter(queryString)) : restaurants;
                // 调用 callback 返回建议列表的数据
                cb(results);
            },
            handleSelect(item) {
                console.log(item);
            },
        },
        loadAll() {
            return []
        },


        activated(){
            let label=""

            searchLabels({label}).then(res => {
                this.loadAll=(res.data.labels)

                this.restaurants = [];
                for (let item of this.loadAll) {
                    console.log(item)
                    this.restaurants.push({"value": item})
                    console.log(this.restaurants)
                }


            })
        },
        mounted(){
          //-----初始化数据
          //查询机构用户列表
          this.searchReceptionists()
          //查询系统字典
          this.searchDictInfo()
            let label=""
            searchLabels({label}).then(res => {
                this.loadAll=(res.data.labels)

                this.restaurants = [];
                for (let item of this.loadAll) {
                    console.log(item)
                     this.restaurants.push({"value": item})
                    console.log(this.restaurants)
                }


            })

          //    this.restaurants = this.loadAll();

        }
    }
</script>

<style scoped>

</style>
